<template>
  <div class="box">
    <div class="sonBox">
      <h2>上传附件配置</h2>
      <!-- 新增或修改单页内容对话框 -->
    <!-- <el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body> -->
      <!-- <el-form v-loading="loading" ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="文件格式" prop="title">
          <el-input v-model="form.title" clearable placeholder="请输入文件格式"/>
        </el-form-item>
        <el-form-item label="文件限制大小" prop="content">
            <el-input v-model="form.title" clearable placeholder="请输入文件大小"/> -->
          <!-- <editor v-model="form.content" :min-height="400"/> -->
          <!-- <JEditor :key="showdis" v-model="form.content" :height="500"/> -->
        <!-- </el-form-item>
      </el-form>
      <div class="dialog-footer">
        <el-button type="primary" :disabled="isShows" @click="handleAdd">保 存</el-button>
      </div> -->
    <!-- </el-dialog> -->
    </div>
    
  </div>
</template>

<script>
// import {
//   listSinglepage,
//   getSinglepage,
//   delSinglepage,
//   addSinglepage,
//   updateSinglepage
// } from "@/api/information/singlepage/singlepage.js";
// import { setStorageItem, getStorageItem } from "@/utils/storage.js";
// import Sortable from "sortablejs";
export default {
  name: "Attachment",
  data() {
    return {
      isShows: true,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 单页内容表格数据
      singlepageList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      showdis:112,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        title: null,
        content: null,
        coverImage: null,
        type: null,
        status: null,
      },
      // 列信息
      // columns: [
      //   {
      //     key: -1,
      //     label: "ID",
      //     visible: true,
      //     prop: "id",
      //     htmlType: "input",
      //     dictType: "",
      //     align: "center"
      //   },
      //   {
      //     key: 0,
      //     label: "标题",
      //     visible: true,
      //     prop: "title",
      //     htmlType: "input",
      //     dictType: "",
      //     align: "center"
      //   },
      //   {
      //     key: 1,
      //     label: "内容",
      //     visible: true,
      //     prop: "content",
      //     htmlType: "editor",
      //     dictType: "",
      //     align: "center"
      //   },
      //   {
      //     key: 2,
      //     label: "封面图片",
      //     visible: true,
      //     prop: "coverImage",
      //     htmlType: "imageUpload",
      //     dictType: "",
      //     align: "center"
      //   },
      //   {
      //     key: 3,
      //     label: "分类：1-关于我们,2-联系我们",
      //     visible: true,
      //     prop: "type",
      //     htmlType: "select",
      //     dictType: "",
      //     align: "center"
      //   },
      //   {
      //     key: 4,
      //     label: "状态：0-未发布 1-已发布",
      //     visible: true,
      //     prop: "status",
      //     htmlType: "radio",
      //     dictType: "",
      //     align: "center"
      //   },
      //   {
      //     key: 5,
      //     label: "创建者",
      //     visible: true,
      //     prop: "createBy",
      //     htmlType: "input",
      //     dictType: "",
      //     align: "center"
      //   },
      //   {
      //     key: 6,
      //     label: "创建时间",
      //     visible: true,
      //     prop: "createTime",
      //     htmlType: "datetime",
      //     dictType: "",
      //     align: "center"
      //   },
      //   {
      //     key: 7,
      //     label: "更新者",
      //     visible: true,
      //     prop: "updateBy",
      //     htmlType: "input",
      //     dictType: "",
      //     align: "center"
      //   },
      //   {
      //     key: 8,
      //     label: "更新时间",
      //     visible: true,
      //     prop: "updateTime",
      //     htmlType: "datetime",
      //     dictType: "",
      //     align: "center"
      //   },
      //   {
      //     key: 9,
      //     label: "备注",
      //     visible: true,
      //     prop: "remark",
      //     htmlType: "textarea",
      //     dictType: "",
      //     align: "center"
      //   },
      //   {
      //     key: 10,
      //     label: "租户ID",
      //     visible: true,
      //     prop: "tenantId",
      //     htmlType: "input",
      //     dictType: "",
      //     align: "center"
      //   },
      //   {
      //     key: 0,
      //     label: `操作`,
      //     visible: true,
      //     prop: "operation",
      //     htmlType: "operation",
      //     align: "center",
      //     width: "200",
      //     className: "fixed-width"
      //   }
      // ],
      // 表单参数
      form: {
        title: null,
        content:null,
      },
      // 表单校验
      rules: {
        title: [{ required: true, message: "标题不能为空", trigger: "blur" }],
        content: [{ required: true, message: "内容不能为空", trigger: "blur" }],
      }
    };
  },
//   computed: {
//     newForm() {
//       return JSON.parse(JSON.stringify(this.form))
//     }
//   },
//   watch:{
//     newForm:{
//       handler(val,oldVal) {
//         if (oldVal.title == null && oldVal.content == null) {
//           this.isShows = true
//         } else {
//           if (val.title !== oldVal.title || val.content !== oldVal.content) {
//           this.isShows = false
//         }
//         }

//       },
//       deep: true,
//       immediate:false
//     }
//   },
  // beforeRouteEnter(to, from, next) {
  //   next(vm => {
  //     vm.getList()
  //   })
  // },
  created() {
    // let data = getStorageItem(this.$options.name);
    // if (data) {
    //   this.columns = data;
    // }
    // this.getList();
  },
  // mounted() {
  //   this.getList();
  // },
  methods: {
    //列拖拽
    // columnDrop() {
    //   const wrapperTr = this.$refs.singlepageTable.$el.querySelector(
    //     ".el-table__header-wrapper tr"
    //   );
    //   this.sortable = Sortable.create(wrapperTr, {
    //     animation: 180,
    //     delay: 30,
    //     // draggable: ".drag",
    //     onEnd: evt => {
    //       if (evt.oldIndex === evt.newIndex) return;
    //       const oldItem = this.columns[evt.oldIndex];
    //       const newItem = this.columns[evt.newIndex];
    //       this.$set(this.columns, evt.newIndex, oldItem);
    //       this.$set(this.columns, evt.oldIndex, newItem);
    //       setStorageItem(this.$options.name, this.columns);
    //     }
    //   });
    // },
    // dataChange(data) {
    //   for (let item in this.columns) {
    //     const key = this.columns[item].key;
    //     this.columns[item].visible = !data.includes(key);
    //   }

    //   setStorageItem(this.$options.name, this.columns);
    // },
    // changeColumns(data) {
    //   this.columns = data;
    //   setStorageItem(this.$options.name, data);
    //   this.isShow = !this.isShow;
    // },
    /** 查询单页内容列表 */
    // getList() {
    //   this.loading = true;
    //   listSinglepage().then(response => {
    //     console.log(response, '333');
    //     this.showdis = Math.random();
    //     this.form = response.data;
    //     this.isShows = true;
    //     this.loading = false
    //   });
    // },
    // 取消按钮
    // cancel() {
    //   // this.$nextTick(() => {
        
    //   // })
    //   this.isShows = false;
    // },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        title: null,
        content: null,
        coverImage: null,
        type: null,
        status: 0,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null,
        remark: null,
        tenantId: null
      };
      this.resetFormData("form");
    },
    // /** 新增按钮操作 */
    // handleAdd() {
    //    this.$modal
    //     .confirm('是否确认要修改分中心概况内容吗？')
    //      .then(() => {
    //       this.submitForm()
    //     })
    //     .catch(() => {});
    // },
    /** 修改按钮操作 */
    // handleUpdate(row) {
    //   this.reset();
    //   const id = row.id || this.ids;
    //   getSinglepage(id).then(response => {
    //     this.showdis = Math.random();
    //     this.form = response.data;
    //   });
    // },
    /** 提交按钮 */
    // submitForm() {
    //   this.$refs["form"].validate(valid => {
    //     if (valid) {
    //       if (this.form.id != null) {
    //         updateSinglepage(this.form).then(response => {
    //           this.$modal.msgSuccess("修改成功");
    //           this.open = false;
    //           this.getList();
    //         });
    //       } else {
    //         addSinglepage(this.form).then(response => {
    //           this.$modal.msgSuccess("新增成功");
    //           this.open = false;
    //           this.getList();
    //         });
    //       }
    //     }
    //   });
    // },
  }
};
</script>
<style lang="scss" scoped>
.box {
  // top: -30px;
  margin: 40px auto;
  width: 60%;
  }
  .sonBox {
    // margin: 15px auto;
    text-align: center;
  }
</style>
